new Vue({
    el: "#comment-area-comment",
    template: `
      <div>
        <button gz_type @click="hideCommentAreaBut">隐藏评论区</button>
        <button gz_type @click="showCommentAreaBut">显示评论区</button>
        <div>
          <input type="checkbox" v-model="isAutoHideCommentArea">加载视频之后自动隐藏评论区
        </div>
      </div>`,
    data() {
        return {
            isAutoHideCommentArea: false,
        }
    },
    methods: {
        hideCommentAreaBut() {
            getElement("#commentapp").then(element => {
                //标记 为已隐藏
                element.setAttribute("data-is-hidden", "true");
                element.style.display = "none";
                Qmsg.success("已隐藏评论区", {position: "bottomright"});
            })
        },
        showCommentAreaBut() {
            getElement("#commentapp").then(element => {
                //标记 为未隐藏
                element.setAttribute("data-is-hidden", "false");
                element.style.display = "";
                Qmsg.success("已显示评论区", {position: "bottomright"});
            })
        }
    },
    watch: {
        isAutoHideCommentArea(val) {
            gmUtil.setData("isAutoHideCommentArea", val);
        }
    },
    created() {
        this.isAutoHideCommentArea = gmUtil.getData("isAutoHideCommentArea", false) === true;
        if (this.isAutoHideCommentArea) {
            setTimeout(() => {
                this.hideCommentAreaBut();
            }, 2000);
        }
    }
});
